<template>
	<div class="test-cont" @click="handleHide">
		<!-- 列表头部组件 -->
		<div>
			<custom-header :title="title" ref="customHeader" :hideRight="true"></custom-header>
		</div>
		<!-- <div class="body"> -->
		<!-- 筛选栏 -->
		<div class="drop-down-cont">
			<van-dropdown-menu>
				<van-dropdown-item v-model="sortId" :options="majorList" @change="getTestList" />
				<van-dropdown-item v-model="batchId" :options="batchList" @change="getTestList" />
			</van-dropdown-menu>
		</div>
		<!-- 列表 -->
		<van-tabs v-model="current" swipeable @change="tabsChange" line-width="125" color="#047bfc">
			<van-tab v-for="tab in tabs" :title="tab.name" :key="tab.id">
				<div class="current" v-show="current==0">
					<div class="current-list">
						<current-item :list="list" @enterExam="enterExam" :loading="loading" :finished="finished" :sortId="sortId" :batchId="batchId"></current-item>
					</div>
				</div>
				<div class="about-start" v-show="current==1">
					<div class="about-start-list">
						<about-start-item :list="list" :loading="loading" :finished="finished"></about-start-item>
					</div>
				</div>
				<div class="end" v-show="current==2">
					<div class="end-list">
						<end-item :list="list" :loading="loading" :finished="finished"></end-item>
					</div>
				</div>
				<!-- <div class="no-more" v-if="(current===0&&list&&!list.length)||(current===1&&list&&!list.length)||(current===2&&list&&!list.length)">
					<van-loading size="24px">加载中...</van-loading>
				</div> -->
			</van-tab>
		</van-tabs>

	</div>
</template>

<script>
import customHeader from "@/components/custom-header.vue";
import currentItem from "@/pages/testList/components/current/current.vue";
import aboutStartItem from "@/pages/testList/components/about-start/about-start.vue";
import endItem from "@/pages/testList/components/end/end.vue";
export default {
	name: "test-list",
	components: {
		customHeader,
		currentItem,
		aboutStartItem,
		endItem,
	},
	data() {
		return {
			title: "考试列表",
			tabs: [
				{ id: "1", name: "正在进行" },
				{ id: "2", name: "即将开始" },
				{ id: "3", name: "已经截止" },
			],
			list: [],
			current: 0,
			majorList: [],
			batchList: [],
			batchId: "",
			sortId: "",
			brower: "",
			majorTitle: "",
			batchTitle: "",
			majorChoiceIndex: 0,
			batchChoiceIndex: 0,
			status: "",
			loading: false,
			finished: true,
		};
	},

	created() {
		this.initData();
		this.getUa();
	},
	methods: {
		enterExam() {
			// uni.reLaunch({
			// 	url: "/pages/testValid/testValid",
			// });
		},
		// tabs通知swiper切换
		tabsChange(tab) {
			// window.console.log(tab);
			this.list = [];
			this.current = tab;
			this.getTestList();
		},
		// swiper-item左右移动，通知tabs的滑块跟随移动
		transition(e) {
			let dx = e.detail.dx;
			this.$refs.uTabs.setDx(dx);
		},
		// 由于swiper的内部机制问题，快速切换swiper不会触发dx的连续变化，需要在结束时重置状态
		// swiper滑动结束，分别设置tabs和swiper的状态
		animationfinish(e) {
			let current = e.detail.current;
			this.$refs.uTabs.setFinishCurrent(current);
			this.swiperCurrent = current;
			this.current = current;
			this.getTestList();
		},
		changeTab(index) {
			this.current = index;
			this.getTestList();
		},
		goBack() {
			// uni.navigateBack({
			// 	delta: 0,
			// });
		},
		getBrowser() {
			var ua = navigator.userAgent.toLocaleLowerCase();
			var Browser = null;
			var browserVersion = null;
			if (ua.match(/msie/) != null || ua.match(/trident/) != null) {
				Browser = "IE";
				browserVersion =
					ua.match(/msie ([\d.]+)/) != null
						? ua.match(/msie ([\d.]+)/)[1]
						: ua.match(/rv:([\d.]+)/)[1];
				return "IE";
			} else if (ua.match(/firefox/) != null) {
				Browser = "火狐";
				return "FF";
			} else if (ua.match(/ubrowser/) != null) {
				Browser = "UC";
				return "UC";
			} else if (ua.match(/opera/) != null) {
				Browser = "欧朋";
				return "OP";
			} else if (ua.match(/bidubrowser/) != null) {
				Browser = "百度";
				return "baidu";
			} else if (ua.match(/metasr/) != null) {
				Browser = "搜狗";
				return "SG";
			} else if (
				ua.match(/tencenttraveler/) != null ||
				ua.match(/qqbrowse/) != null
			) {
				Browser = "QQ";
				return "QQ";
			} else if (ua.match(/maxthon/) != null) {
				Browser = "遨游";
				return "AY";
			} else if (ua.match(/chrome/) != null) {
				var is360 = this.mime(
					"type",
					"application/vnd.chromium.remoting-viewer"
				);
				if (is360) {
					Browser = "360";
					return "360";
				} else {
					return "Chrome";
				}
			} else if (ua.match(/safari/) != null) {
				Browser = "Safari";
				return "Safari";
			}
		},
		mime(option, value) {
			var mimeTypes = navigator.mimeTypes;
			for (var mt in mimeTypes) {
				if (mimeTypes[mt][option] == value) {
					return true;
				}
			}
			return false;
		},
		getUa() {
			var sourceType = "";
			if (
				/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(
					navigator.userAgent
				)
			) {
				var u = navigator.userAgent;
				var isandroid = u.indexOf("Android") > -1 || u.indexOf("Adr") > -1; //android终端
				var isios = !!u.match(/\(i[^;]+;( u;)? CPU.+Mac OS X/); //ios终端
				// console.log('是否是android：' + isandroid);
				// console.log('是否是ios：' + isios);
				//数据来源，1、web,2、 android,3、 ios
				if (isandroid) {
					sourceType = "2";
				} else if (isios) {
					sourceType = "3";
				}
			} else {
				// console.log("PC");
				sourceType = "1";
			}
			this.browser = this.getBrowser();
			window.console.log(this.browser);
			localStorage.setItem("sourceType", sourceType);
			localStorage.setItem("browser", this.browser);
		},
		initData() {
			this.$api.major.majorList().then((res) => {
				// window.console.log(res);
				if (res.list && res.list.length > 0) {
					this.majorList = res.list.map((item) => {
						return {
							text: item.Title,
							value: item.Id,
						};
					});
					this.sortId = localStorage.getItem("activeSortId") || res.list[0].Id;
					this.majorTitle = res.list[0].Title;
				}

				this.$api.batch.batchList().then((res) => {
					if (res.list && res.list.length) {
						this.batchList = res.list.map((item) => {
							return {
								text: item.Title,
								value: item.Id,
							};
						});
						this.batchId =
							localStorage.getItem("activeBatchId") || res.list[0].Id;
						this.batchTitle = res.list[0].Title;
					}
					this.getTestList();
				});
			});
		},
		getTestList() {
			this.finished = false;
			this.loading = true;
			this.$api.test
				.testList({
					type: this.current * 1 + 1,
					batchId: this.batchId,
					sortId: this.sortId,
					homeWorkName: "",
					pageSize: 10,
					page: 1,
				})
				.then((res) => {
					this.status = "";
					if (res.code > 0) {
						this.list = res.list;
					} else {
						this.$toast.fail({
							message: res.msg,
							forbidClick: true,
							duration: 2000,
						});
					}
				})
				.finally(() => {
					this.finished = true;
					this.loading = false;
				});
		},
		handleHide() {
			this.$refs.customHeader.hide();
		},
	},
};
</script>

<style lang="less" scoped>
@import "index.less";
</style>
